<template>
	<view class="boxx">
		<!-- 返回 -->
		<img src="../../static/img/fanhui.png" alt="" class="return">
		<!-- word -->
		<p class="one">账号</p>
		<div class="id">
			<input type="text" class="user_id" v-model="user">
		</div>
		<div class="register">

		</div>
		<p class="tow">密码</p>
		<div class="password">
			<input type="password" class="user_password" v-model="password">
		</div>
		<img src="../../static/img/14.png" alt="" class="lower" @click="login">

		<view class="toggle">
			<text @click="toRegister">注册-></text>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				user: "",
				password: ""
			}
		},
		methods: {
			toRegister() {
				uni.navigateTo({
					url: "register"
				})
			},
			async login() {
				let res = await uni.request({
					url: this.$config.basisIP,
					method: "POST",
					data: {
						fun: "login",
						username: this.user,
						password: this.password
					},
					header: {
						"content-type": "application/x-www-form-urlencoded"
					}

				})
				
				res = res[1].data
				
				if (res.msg === "ok") {
					uni.showToast({
						title: "登录成功"
					})
					this.$store.commit("changeLogin")
					
					setTimeout(function () {
					
						uni.switchTab({
							url: "mine"
						})
					}, 1500)
				} else {
					uni.showToast({
						title: "账号或密码错误",
						image: "../../static/img/tubiao8-.png"
					})
				}
			}
		}
	}
</script>

<style scoped>
	.return {
		margin-top: 36rpx;
		margin-left: 18rpx;
		width: 54rpx;
		height: 54rpx;
	}

	.one {
		margin-left: 145rpx;
		margin-top: 181rpx;
		height: 36rpx;
		font-size: 36rpx;
		font-weight: bold;
	}

	.tow {
		margin-left: 145rpx;
		margin-top: 91rpx;
		height: 36rpx;
		font-size: 36rpx;
		font-weight: bold;
	}

	.toggle {
		text-align: right;
		font-size: 32rpx;
		margin-top: 30rpx;
		padding: 20rpx;
	}

	/* 账号 */
	.id {
		margin-top: 36rpx;
		margin-left: 91rpx;
		background-color: #FFDA44;
		width: 543rpx;
		height: 91rpx;
		line-height: 91rpx;
		border-radius: 181rpx;
		border: 5rpx black solid;
	}

	/* 密码 */
	.password {
		margin-top: 36rpx;
		margin-left: 91rpx;
		background-color: white;
		width: 543rpx;
		height: 91rpx;
		line-height: 91rpx;
		border-radius: 181rpx;
		border: 5rpx black solid;
	}

	/* 账号文本框 */
	.user_id {
		margin-top: 5rpx;
		margin-left: 33rpx;
		width: 471rpx;
		height: 80rpx;
		font-size: 54rpx;
		font-weight: bold;
		background-color: #FFDA44;
		color: white;
		border: 0px;
	}

	/* 密码文本框 */
	.user_password {
		margin-top: 5rpx;
		margin-left: 33rpx;
		width: 471rpx;
		height: 80rpx;
		font-size: 54rpx;
		font-weight: bold;
		color: black;
		border: 0px;
	}

	.lower {
		display: block;
		margin: 0 auto;
		margin-top: 181rpx;
		width: 109rpx;
		height: 109rpx;
	}
</style>
